import echarts from 'echarts/lib/echarts'
import { lineData } from '../../config/getData'

export const drawLine = function (that) {
	// 数据处理
	let myChart = echarts.init(document.getElementById('container'));
	myChart.setOption({
	tooltip: {
		trigger: 'axis',
		position: function (pt) {
			return [pt[0], '10%'];
		}
	},
	grid:{
		y:20
	},
	title: {
		left: 'center',
		text: '面积图',
	},
	toolbox: {
		feature: {
			dataZoom: {
				yAxisIndex: 'none'
			},
			restore: {},
			saveAsImage: {}
		}
	},
	xAxis: {
		type: 'category',
		boundaryGap: false,
		data: that.date
	},
	yAxis: {
		type: 'value',
		boundaryGap: [0, '100%']
	},
	dataZoom: [{
		type: 'slider',
		start: 0,
		end: 100
	}, {
		start: 0,
		end: 10,
		handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
		handleSize: '60%',
		handleStyle: {
			color: '#fff',
			shadowBlur: 3,
			shadowColor: 'rgba(0, 0, 0, 0.6)',
			shadowOffsetX: 2,
			shadowOffsetY: 2
		}
	}],
	series: [
		{
			name:'均值',
			type:'line',
			smooth:true,
			symbol: 'none',
			sampling: 'average',
			itemStyle: {
				normal: {
					color: 'rgb(255, 70, 131)'
				}
			},
			areaStyle: {
				normal: {
					color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
						offset: 0,
						color: 'rgb(255, 158, 68)'
					}, {
						offset: 1,
						color: 'rgb(255, 70, 131)'
					}])
				}
			},
			data: that.data
		}
	]
	})
}


export const getData = (str, that) => {
	lineData(str)
	.then(res => {
		that.date = [];
		that.data = [];
		for(let v of res.data) {
			that.date.push(v.times);
			that.data.push(Number(v.price).toFixed(2))
		}
		drawLine(that)
	})
};

export const btn = (i, that) => {
	let len = that.date.length;
	that.num = i;
	if( i === 0 ) {
		lineData('day')
		.then(res => {
			that.date = [];
			that.data = [];
			that.currentPrice = res.url.price

			for(let v of res.data) {
				that.date.push(v.times.slice(11));
				that.data.push(Number(v.price).toFixed(2))
			}
			drawLine(that)
		})
	}else if( i === 1) {
		getData('week', that)
	}else if( i === 2) {
		getData('month', that)
	}else if( i === 3) {
		getData('year', that)
	}
}
